<!-- 物业投诉 -->
<template>
  <div class="notic">
    <!-- 标题栏 -->
    <myheader title="发布公告" rightBtn="主页" @updataInfo="submitRecruit"></myheader>

    <!-- 内容 -->
    <div class="notic_div_title">发布公告</div>
    <ul class="notic_div">
      <li class="notic_div_li">
        <div class="notic_div_li_div">标题:</div>
        <el-input
          type="textarea"
          show-word-limit="true"
          autosize
          placeholder="请输入标题"
          v-model="notic.title"
        ></el-input>
      </li>

      <li>
        <div>
          内容：
          <span></span>
        </div>
        <el-input
          type="textarea"
          show-word-limit="true"
          placeholder="请输入内容"
          v-model="notic.content"
        ></el-input>
      </li>
      <li></li>
      <div class="notic_div_btn">
        <el-button type="primary" @click="upload">提交</el-button>
      </div>
    </ul>
  </div>
</template>

<script>
import myheader from '../../comon/myheader.vue'
import { Toast } from 'vant'
export default {
  components: {
    myheader,
  },
  data() {
    return {
      notic: {
        userId: this.$store.getters.getUserInfo.id,
        title: '',
        content: '',
      },
    }
  },

  methods: {
    async upload() {
      if (this.notic.title == '') {
        Notify({ type: 'warning', message: '请填写标题' })
        return
      } else if (this.notic.content == '') {
        Notify({ type: 'warning', message: '填写内容' })
        return
      } else {
        const res = await this.$axios.post('/notice/save', {
          userId: this.notic.userId,
          title: this.notic.title,
          content: this.notic.content,
        })
        if (res.data.code == 200) {
          Toast('发布成功！')
          this.$router.push('/home/notice')
        }
      }
    },

    submitRecruit() {
      this.$router.push('/')
    },
  },
}
</script>

<style>
.notic_div {
  padding: 3%;
  margin-top: 15px;
}
.notic_div_title {
  font-size: 18px;
  color: #bbbbbb;
  width: 100%;
  background-color: #f1f1f1;
  padding: 5px;
  text-align: center;
}
.notic_div_title > span {
  color: red;
}

/* 投诉内容开始 */
.notic_div > li {
  padding-top: 3%;
  padding-left: 3%;
  padding-right: 3%;
}
.notic_div > li > div {
  font-size: 16px;
  margin-bottom: 3%;
}
.notic_div > li > div > span {
  color: red;
}

/* 提交按钮 */
.notic_div_btn {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
